<%--
  Created by IntelliJ IDEA.
  User: guoshunw
  Date: 2014/10/9
  Time: 19:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE HTML>
<html>
<head>
    <title>OSP Login Page</title>

    <meta charset="UTF-8"/>
    <meta name="Designer" content="PremiumPixels.com">
    <meta name="Author" content="$hekh@r d-Ziner, CSSJUNTION.com">

    <link rel="stylesheet" type="text/css" href="css/login/reset.css">
    <link rel="stylesheet" type="text/css" href="css/login/structure.css">
    <style media="screen" type="text/css">
        body {
            font-size: 0.75em;
        }
        .errorText{
            color: red;
        }
    </style>
    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>

</head>

<body>
<form class="box login" id="loginForm" action="login" method="post">
<div class="boxTitle">Operation Service Portal</div>
    <fieldset class="boxBody">
        <label id="labelForCsl" >
            CSL
        </label>
        <input type="text" tabindex="1" name="csl" placeholder="Your CSL" required>
        <label>
            <%--<a href="#" class="rLink" tabindex="5">Forget your password?</a>--%>
            Password
        </label>
        <input type="password" name="password" tabindex="2" required>

        <div class="errorText">
            <s:actionerror/>
        </div>
    </fieldset>
    <footer>
        <label><input type="checkbox" name="rememberMe" checked="checked" tabindex="3">Remember me</label>
        <input type="hidden" id="timeZoneOffset" name="timeZoneOffset" value=""/>
        <input type="submit" class="btnLogin" id="loginTrigger" value="Login" tabindex="4">
    </footer>
</form>
<footer id="main">
    <%--<a href="http://wwww.cssjunction.com">Simple Login Form (HTML5/CSS3 Coded) by CSS Junction</a> |--%>
    <%--<a href="http://www.premiumpixels.com">PSD by Premium Pixels</a>--%>
</footer>

<script type="text/javascript">
    !function () {
        var offset = -new Date().getTimezoneOffset() * 60 * 1000;
        $("#timeZoneOffset").val(offset);

        $("#loginForm").submit(function (e) {
            $("#loginTrigger").prop("disabled", true);
            $("#labelForCsl").append(
                    $("<img src='images/wait/4.gif' style='vertical-align: middle'>")
            );
//            e.preventDefault();
        });

    }.call(this);
</script>
</body>
</html>